<template>
  <el-select
    v-model="roleId"
    clearable
    placeholder="请选择角色">
    <el-option
      v-for="item of $store.state.common.roleOptions"
      :key="item.roleId"
      :label="item.name"
      :value="item.roleId">
    </el-option>
  </el-select>
</template>

<script>
import { mapActions } from 'vuex'
export default {
  props: {
    value: {
      type: String
    }
  },
  data() {
    return {
      roleOptions: []
    }
  },
  computed: {
    roleId: {
      get() {
        return this.value
      },
      set(val) {
        this.$emit('input', val)
      }
    }
  },
  mounted() {
    this.getRoleData()
  },
  methods: {
    ...mapActions('common', ['getRoleData'])
  }
}
</script>
